import { messages } from "share/common";
import React, { Component } from "react";
import AdvanceTable from "components/advanced-table";
import SlideFrame from "components/slide-frame";
import ResidenceForm from "../components/residence-form";

import { Checkbox, Button, Spin, message, Divider, Popconfirm } from "antd";
import HotelServer from "../hotel-server";

class SetResidence extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: false,
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10,
      },
      columns: [
        {
          title: messages("supplier-1.key466") /*城市*/,
          dataIndex: "cityName",
          key: "cityName",
        },
        {
          title: messages("supplier-1.key467") /*常驻地名称*/,
          dataIndex: "locationName",
          key: "locationName",
        },
        {
          title: messages("supplier-1.key468") /*常驻地*/,
          dataIndex: "location",
          key: "location",
        },
        {
          title: messages("supplier-1.key469") /*常驻地经纬度*/,
          dataIndex: "lngLat",
          key: "lngLat",
        },
        {
          title: messages("common.operation") /*操作*/,
          dataIndex: "operator",
          key: "operator",
          render: (v, r, index) => {
            return (
              <div>
                <a>{messages("common.edit") /*编辑*/}</a>
                <Divider type="vertical" />
                <Popconfirm
                  title={messages("supplier-1.key489") /*你确定删除这行内容吗?*/}
                  onConfirm={() => this.onDeleteCity(index)}
                  okText={messages("common.ok") /*确定*/}
                  cancelText={messages("common.cancel") /*取消*/}
                >
                  <a
                    style={{ color: "red" }}
                    onClick={(eve) => {
                      eve.stopPropagation();
                    }}
                  >
                    {messages("common.delete") /*删除*/}
                  </a>
                </Popconfirm>
              </div>
            );
          },
        },
      ],
      isEdit: false,
      showSlideFrame: false,
      hotelData: {},
      currentEditData: {},
    };
  }

  onDeleteCity = (index) => {
    const { hotelData } = this.state;
    let optionData = {
      ...hotelData[index],
      isDeleted: true,
      companyOid: this.props.companyOID,
    };
    HotelServer(this)
      .addResidence(optionData)
      .then((res) => {
        if (res.data.code === 200) {
          this.advanceTable.getList();
        }
      });
  };

  onAddAddress = () => {
    this.setState({ showSlideFrame: true });
  };

  advanceTableRef = (advanceTable) => {
    this.advanceTable = advanceTable;
  };

  advanceTableServer = (page, size, searchValues, status) => {
    return HotelServer(this)
      .getPlatformModelData({ companyOid: this.props.companyOID })
      .then((res) => {
        res.data.rows = res.data.body.hotelLocationDtoList || [];
        res.data.total = res.data.body.hotelLocationDtoList ? res.data.body.hotelLocationDtoList.length : 0;
        this.setState({ hotelData: res.data.body.hotelLocationDtoList || [] });
        return res;
      });
  };

  onTableRow = (record) => {
    this.setState({
      currentEditData: record,
      isEdit: true,
      showSlideFrame: true,
    });
  };

  getAdvanceTableOption = () => {
    const { columns } = this.state;
    const option = {
      service: this.advanceTableServer,
      index: true,
      onRef: this.advanceTableRef,
      rowKey: (record, index) => record.cityCode || index,
      columns: columns,
      onRow: (record) => ({
        onClick: () => this.onTableRow(record),
      }),
      pagination: false,
      bordered: true,
    };
    return option;
  };

  onCloseSlide = (isUpdate) => {
    if (isUpdate === true) {
      this.advanceTable.getList();
    }
    this.setState({
      showSlideFrame: false,
      isEdit: false,
      currentEditData: {},
    });
  };

  render() {
    const { loading, isEdit, showSlideFrame, currentEditData } = this.state;
    const { companyOID } = this.props;
    return (
      <div className="airline-config-container">
        <Spin spinning={loading}>
          <Button type="primary" onClick={this.onAddAddress}>
            {messages("common.add") /*添加*/}
          </Button>
          <AdvanceTable.SimpleTable key="set-residence" {...this.getAdvanceTableOption()}></AdvanceTable.SimpleTable>
        </Spin>
        {showSlideFrame && (
          <SlideFrame
            width={800}
            title={isEdit ? messages("common.edit") /*编辑*/ : messages("supplier-1.key490") /*新建temp*/}
            show={showSlideFrame}
            content={ResidenceForm}
            params={{ companyOID: companyOID, ...currentEditData }}
            afterClose={this.onCloseSlide}
            onClose={() => this.setState({ showSlideFrame: false })}
          />
        )}
      </div>
    );
  }
}

export default SetResidence;
